<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<!-- Module名 day13 -->
		<title>day13 测试springmvc</title>
		<script src="../JQuery/jquery-3.6.0.min.js"></script>
		<script>
			// function fun(){
			// 		$.ajax({
			// 			url:"http://localhost:8080/stu/add",
			// 			data:$("#f1").serialize(),
			// 			success:function(data){
			// 				console.log(data);
			// 			}
			// 		})
			// 	}
			
			// $(function(){
				function funsub(){
					$.ajax({
						url:"http://localhost:8080/car/add3",
						data:$("#fo1").serialize(),
						success:function(data){
							console.log("success");
							console.log(data);
							$("#8_p1").text(JSON.stringify(data));
						},
						error:function(data){
							console.log("error");
							console.log(data);
							$("#8_p1").text(JSON.stringify(data));
						}
						
					})
				}
				
				$(function(){
					$("#8_sub1").click(function(){
						$("#8_p0").text(JSON.stringify($("#fo0").serialize()));
					})
					
				})
				
				
			// })
			
		</script>
	</head>
	<body>
		<p><a href="http://localhost:8080/car/get"> get</a></p>
		<p></p><a href="http://localhost:8080/car/get2"> get2</a></p>
		<p></p><a href="http://localhost:8080/car/add?id="> add?id=</a></p>
		<p></p><a href="http://localhost:8080/car/add?id=1"> add?id=1</a></p>
		<p></p><a href="http://localhost:8080/car/add2?id=1&name=张三"> add2?id=1&name=张三</a></p>
		<p></p><a href="http://localhost:8080/car/add3?id=1&name=张三&color=red&type=Benz&price=1.1">add3?id=1&name=张三&color=red&type=Benz&price=1.1</a></p>

		<div>

			<div>
				

					<form action="http://localhost:8080/car/add3" method="post" id="fo0">
						<table border="0" cellspacing="" cellpadding="1">
							<tr>
								<th colspan="2">add3()方法 form submit访问</th>
							</tr>
							<tr>
								<td colspan="2">
									<span id="8_p0">8_p0 返回form submit方式访问add3提交的值</span>
								</td>
							</tr>
							<tr>
								<td>id:</td>
								<td><input name="id" type="text" /></td>此处name属性值必须和java文件里方法的参数名相同
							</tr>
							<tr>
								<td>name:</td>
								<td><input name="name" type="text" /></td>
							</tr>
							<tr>
								<td>type:</td>
								<td><input name="type" type="text" /></td>
							</tr>
							<tr>
								<td>color:</td>
								<td><input name="color" type="text" /></td>
							</tr>
							<tr>
								<td>price:</td>
								<td><input name="price" type="text" /></td>
							</tr>
							<tr>
								<td>date:</td>
								<td><input name="date" type="date" /></td>
							</tr>
							<tr>
								<td colspan="2" align="center"><input type="submit" value="保存" id="8_sub1" /></td>
							</tr>
					</form>

			</div>

			<div>
				

					<form action="#" id="fo1" method="post">
						<table border="0" cellspacing="" cellpadding="1">
							<tr>
								<th colspan="2">add3()方法 ajax访问</th>
							</tr>
							<tr>
								<td colspan="2">
									<span id="8_p1">8_p1 返回ajax访问add3提交的值</span>
								</td>
							</tr>
							<tr>
								<td>id:</td>
								<td><input name="id" type="text" /></td>此处name属性值必须和java文件里方法的参数名相同
							</tr>
							<tr>
								<td>name:</td>
								<td><input name="name" type="text" /></td>
							</tr>
							<tr>
								<td>type:</td>
								<td><input name="type" type="text" /></td>
							</tr>
							<tr>
								<td>color:</td>
								<td><input name="color" type="text" /></td>
							</tr>
							<tr>
								<td>price:</td>
								<td><input name="price" type="text" /></td>
							</tr>
							<tr>
								<td>date:</td>
								<td><input name="date" type="date" /></td>
							</tr>
							<tr>
								<td colspan="2" align="center"><input type="button" value="保存" onclick="funsub();" /></td>
							</tr>
					</form>

			</div>

		</div>

	</body>
</html>
